Alloy&ACS로 「폭속」＆「무료」로 서버 대응 iOS・Android 앱을 만든다 [유저 등록]

이전에 ACS를 이용하여 「폭속」＆「무료」로 서버 대응 iOS・Android 앱을 만든다이라는 기사에서 샘플을 시작하기까지했습니다.
그러나 불행히도 샘플은 Classic으로 작성되었습니다.
샘플 사용자 등록 코드를 기반으로 ACS를 사용하여 간단한 사용자 등록의 Alloy 버전 코드를 게시합니다.

필요한 정보가 등록되어 있고 Create를 눌렀을 때 사용자를 ACS 서버에 등록합니다. 모든 정보가 등록되지 않았거나 암호와 확인 암호가 일치하지 않으면 사용자 이름이 이미 등록되어 있으면 등록 할 수 없습니다.



tiapp.xml에 ACS와 함께 작동하는 데 필요한 정보가 들어 있는지 확인하십시오.

tiapp.xml

<?xml version="1.0" encoding="UTF-8"?>
<ti:app xmlns:ti="http://ti.appcelerator.org">
    <property name="acs-oauth-secret-production" type="string">自分のacs-oauth-secret-production</property>
    <property name="acs-oauth-key-production" type="string">自分のacs-oauth-key-production</property>
    <property name="acs-api-key-production" type="string">自分のacs-api-key-production</property>
    <property name="acs-oauth-secret-development" type="string">自分のacs-oauth-secret-development</property>
    <property name="acs-oauth-key-development" type="string">自分のacs-oauth-key-development</property>
    <property name="acs-api-key-development" type="string"> 自分のacs-api-key-development</property>
・
・
・
<modules>
    <module platform="commonjs">ti.cloud</module>
</modules>
・
・
・

app/views/index.xml

<Alloy>
  <Window class="container">
    <ScrollView id="scrollView">
      <TextField class="textField" id="username"></TextField>
      <TextField class="textField" id='password'></TextField>
      <TextField class="textField" id='confirmPassword'></TextField>
      <TextField class="textField" id="firstName"></TextField>
      <TextField class="textField" id="lastName"></TextField>
      <TextField class="textField" id="email"></TextField>
      <Button id="create">Create</Button>
    </ScrollView>
  </Window>
</Alloy>

app/styles/index.tss

".container": {
  backgroundColor:"white"
},
"#scrollView":{
  top: 0,
  contentHeight: 'auto',
  layout:'vertical'
}
".textField": {
  top:10, left:10, right:10,
  height:40,
  borderStyle: Ti.UI.INPUT_BORDERSTYLE_ROUNDED,
  autocapitailization: Ti.UI.TEXT_AUTOCAPITALIZATION_NONE,
  autocorrect: false
}
"#username": {
  hintText: 'Username'
}
"#password": {
  hintText: 'Password',
  passwordMask:true
}
"#confirmPassword": {
  hintText: 'Confirm Password',
  passwordMask:true
}
"#firstName": {
  hintText: 'First Name'
}
"#lastName": {
  hintText: 'Last Name'
}
"#email": {
  hintText: 'Email'
}
"#create": {
  top:10, left:10, right:10, bottom:10,
  height:40
}

Create 버튼을 누르면 submitForm을 호출하고 Cloud.Users.create ()를 사용하여 ACS에 입력 정보를 보냅니다. 성공적으로 사용자 등록이 완료되면 e.success를 반환합니다.

app/controllers/index.js

var Cloud = require("ti.cloud");

var fields = [ $.username, $.password, $.confirmPassword, $.firstName, $.lastName ];

function submitForm() {
  for (var i = 0; i < fields.length; i++) { //入力されていないフィードがあったらそのフィードをフォーカス
    if (!fields[i].value.length) {
      fields[i].focus();
      return;
    }
    fields[i].blur();
  }
  if ($.password.value != $.confirmPassword.value) { //パスと確認パスが一致しない場合警告
    alert('Passwords do not match!');
    $.confirmPassword.focus();
    return;
  }
  $.create.hide();

  Cloud.Users.create({ //ACSサーバへの登録
    username: $.username.value,
    password: $.password.value,
    password_confirmation: $.confirmPassword.value,
    first_name: $.firstName.value,
    last_name: $.lastName.value,
    email: $.email.value
  }, function (e) {
    if (e.success) { //登録完了時
      var user = e.users[0];
      alert('Created! You are now logged in as ' + user.id);
      $.username.value = $.password.value = $.confirmPassword.value = $.firstName.value = $.lastName.value = '';
    }
    else { //登録失敗時
      alert(e.message);
    }
    $.create.show();
  });
}

$.create.addEventListener('click', submitForm);
for (var i = 0; i < fields.length; i++) {
  fields[i].addEventListener('return', submitForm);
}

$.index.addEventListener('open', function () {
  $.username.focus();
});

$.index.open();