NCMBのiOS SDKは正式にはSwiftをサポートしておらず、サンプルのコードもObjective-Cとなっています。Swiftもすでに3が主流となっており、利用者も増えています。そこでNCMB iOS SDKをSwiftでどう使えば良いかをコード例を用いつつ紹介します。
今回はフォトライブラリから写真を選択してアップロードする流れです。
Xcodeプロジェクトを作る
まずはベースになるXcodeプロジェクトを作ります。これは言語としてSwiftを選択する以外、特別なことはしません。
ブリッジファイルを作る
Objective-Cで作られたフレームワークをSwiftで使えるようにするためにブリッジファイルを作成します。Xcodeで新規 Header File ファイルを作成します。名前は プロジェクト名-Bridging-Header.h
が良いでしょう。
内容は以下のようになります。
// // HelloNCMB-Bridging-Header.h // HelloNCMB // // #ifndef HelloNCMB_Bridging_Header_h #define HelloNCMB_Bridging_Header_h #import <NCMB/NCMB.h> #endif /* HelloNCMB_Bridging_Header_h */
NCMBのSDKをインストールする
Carthage を使う方法もありますが、対応していないフレームワークもあるので CocoaPods を使います。
CocoaPodsをインストール
Rubygemsを使います。Rubyはすでにインストールされていることとします。
gem install cocoapods pod setup cd (Xcodeプロジェクトのディレクトリ) pod init
プラグインをインストール
mBaaSでは認証キーを扱うので、それを直接ハードコーディングするのは好ましくありません。そこで cocoapods-keys
を使います。
Gemfileを作成して、内容を次のようにします。
source 'https://rubygems.org' gem 'cocoapods-keys'
そしてインストールします。
bundle install
Podfileを作る
Podfileを以下の内容で作成します。 (プロジェクト名)
となっている部分はそれぞれ読み替えてください。
# Uncomment the next line to define a global platform for your project platform :ios, '9.0' target '(プロジェクト名)' do # Comment the next line if you're not using Swift and don't want to use dynamic frameworks use_frameworks! # Pods for (プロジェクト名) pod 'NCMB', :git => 'https://github.com/NIFCloud-mbaas/ncmb_ios.git' target '(プロジェクト名)Tests' do inherit! :search_paths # Pods for testing end target '(プロジェクト名)UITests' do inherit! :search_paths # Pods for testing end end plugin 'cocoapods-keys', { :project => "(プロジェクト名)", :keys => [ "applicationKey", "clientKey" ]}
SDKのインストール
pod install
でSDKのインストールを行います。この時、 cocoapods-keys
が対話的にキーを保存してくれます。
pod install CocoaPods-Keys has detected a keys mismatch for your setup. What is the key for applicationKey > e61...669 Saved applicationKey to HelloNCMB. What is the key for clientKey > 65c...247 Saved clientKey to HelloNCMB. Analyzing dependencies Fetching podspec for `Keys` from `Pods/CocoaPodsKeys` Downloading dependencies Using Keys (1.0.1) Using NCMB (2.4.3) Generating Pods project Integrating client project Sending stats
ブリッジヘッダーファイルを指定する
プロジェクト名-Bridging-Header.h
を編集します。キーファイルを読み込みます。プロジェクト名はそれぞれ読み替えてください。Podプロジェクトの Development Pods/Keys
以下にあるファイルを読み込みます。
#ifndef (プロジェクト名)_Bridging_Header_h #define (プロジェクト名)_Bridging_Header_h #import <NCMB/NCMB.h> #import "(プロジェクト名)Keys.h" #endif
Build Settingsの Objective-C Bridging Header
の項目で先ほど作ったブリッジヘッダーファイルを指定します。例えば ./HelloNCMB/HelloNCMB-Bridging-Header.h
といった具合です。
コードを書く
キーを読み込む
AppDelegate.swift にてキーを読み込みます。 (プロジェクト名)Keys()
という関数が定義されています。例えば以下のようになります。
let keys = HelloNCMBKeys()
これで keys.applicationKey
といった形でアクセスできます。
NCMBを初期化する
まずNCMBを初期化します。これは AppDelegate.swift に実装します。
NCMB.setApplicationKey(keys.applicationKey, clientKey: keys.clientKey)
以下は ViewController.swift に実装します。
画面に部品を配置する
今回は選択した画像を表示する UIImageView 、ライブラリを開く UIButton 、アップロードを行う UIButton 、写真を消す UIButton を追加しました。
ViewController にデリゲートを追加する
ViewController に UIImagePickerControllerDelegate と UINavigationControllerDelegate を追加します。
class ViewController: UIViewController, UIImagePickerControllerDelegate, UINavigationControllerDelegate {
追加すべきメソッドは imagePickerController です。これは写真を選択した際に呼ばれます。
func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [String : Any]) { // 選択した写真を取得 let image = info[UIImagePickerControllerOriginalImage] as! UIImage // ImageViewに表示する self.imageView.image = image // 写真を選ぶビューを消す self.dismiss(animated: true) }
初期表示する画像を指定する
UIImageViewをアウトレットで追加します。
@IBOutlet weak var imageView: UIImageView!
そして初期表示する画像を指定します。
override func viewDidLoad() { super.viewDidLoad() imageView.image = UIImage(named: "default.png") // Do any additional setup after loading the view, typically from a nib. }
ライブラリを開く
ライブラリを開くボタンを押した時のアクションです。
@IBAction func btnSelect(_ sender: Any) { if UIImagePickerController.isSourceTypeAvailable(.photoLibrary) { // 写真を選ぶビュー let pickerView = UIImagePickerController() // ライブラリから選ぶ pickerView.sourceType = .photoLibrary pickerView.delegate = self // 表示 self.present(pickerView, animated: true) } }
リセットボタンを押した時のイベント
これは初期表示と同じです。
@IBAction func btnReset(_ sender: Any) { self.imageView.image = UIImage(named: "default.png") }
写真をアップロードする処理
写真をアップロードするボタンを押した時の処理です。選択されている写真データを UIImageJPEGRepresentation
を使ってNSDataに変換するのがポイントです。ファイル名はアップロード日時としています。
そして saveInBackground
でアップロード処理を実行します。
@IBAction func btnUpload(_ sender: Any) { let photoData:Data = NSData(data: UIImageJPEGRepresentation(self.imageView.image!, 0.80)!) as Data // ファイル名の処理 let formatter = DateFormatter() formatter.dateFormat = "MM-dd-HH-mm-ss" let fileName = formatter.string(from: Date()) + ".jpg" // データとファイル名でNCMBFileを作成 let file = NCMBFile.file(withName: fileName, data: photoData) as! NCMBFile // 保存処理 file.saveInBackground({ (error) in if error != nil { // 保存失敗時の処理 print(error?) } else { // 保存成功時の処理 } }) }
処理が適切に実装されていれば、写真がファイルストアにアップロードされるはずです。
まとめ
写真をアップロードしたいというニーズはよくあるでしょう。NCMBを使えばコード量少なく実装が可能です。ぜひお試しください!