ホームページ > ウェブフロントエンド > uni-app > uniappをossにデプロイする方法

uniappをossにデプロイする方法

PHPz
リリース: 2023-04-27 14:33:42
オリジナル
1392 人が閲覧しました

UniApp は、Vue.js とミニ プログラム テクノロジに基づくクロスエンド開発フレームワークであり、開発者は同じコード セットを異なるプラットフォームでの開発に使用できるため、開発効率が大幅に向上します。開発が完了したら、すぐにアクセスして使用できるようにアプリケーションをクラウドにデプロイする必要があります。

この記事では、UniApp アプリケーションを Alibaba Cloud OSS (Object Storage Service) にデプロイし、オンライン アクセスを実現する方法を紹介します。

1. OSS の概要

Alibaba Cloud OSS は、データの保存、管理、オンライン アクセスを実現できる、信頼性と拡張性に優れたクラウド ストレージ サービスです。 OSS は、大容量、効率的、低コストのストレージ サービスを提供し、さまざまな種類のデータ アクセスもサポートします。

2. UniApp のパッケージ化

UniApp アプリケーションをデプロイする前に、それを静的ファイルとしてパッケージ化する必要があります。

  1. ターミナルを開き、UniApp プロジェクトのルート ディレクトリを入力します。
  2. 次のコマンドを実行してパッケージ化します:
npm run build:h5
ログイン後にコピー
  1. パッケージ化が完了すると、プロジェクト ディレクトリに dist フォルダーが生成されます。アプリケーション プログラムの静的ファイルが含まれます。

3. OSS バケットの作成

  1. Alibaba Cloud コンソールにログインし、OSS を選択します。
  2. 「ストレージスペースの作成」をクリックします。
  3. ポップアップ作成ストレージ スペース ページで、必要に応じて必須パラメータを入力します。ストレージスペースのタイプとして「標準ストレージ」を選択します。他のオプションはデフォルト設定のままでかまいません。
  4. 「OK」をクリックして作成を完了します。作成後、新しく作成されたストレージスペースがストレージスペースリストに表示されます。

4. OSS へのファイルのアップロード

  1. ストレージ スペース名をクリックして、ストレージ スペース インターフェイスに入ります。
  2. [ファイル管理] を選択し、ポップアップ ページで [ファイルのアップロード] を選択します。
  3. ポップアップの「ファイルのアップロード」ページで、パッケージ化したばかりの静的フォルダー dist 内のすべてのファイルを選択し、「アップロード」ボタンをクリックします。
  4. アップロードが完了すると、ファイル管理リストにアップロードされたファイルが表示されます。

5. バケット ドメイン名の設定

  1. ストレージ スペース名をクリックして、ストレージ スペース インターフェイスに入ります。
  2. [ドメイン名管理] を選択すると、ページ上に bucket-name.region.aliyuncs.com の形式でデフォルトのアクセス ドメイン名が表示されます。
  3. CDN コンソールに入り (サービスがアクティブ化されていない場合は、最初にアクティブ化する必要があります)、コンソールで [ドメイン名管理] を選択します。
  4. [ドメイン名の追加] をクリックし、プロンプトに従ってカスタム ドメイン名を作成します。
  5. 作成が成功すると、ドメイン名リストに追加したばかりのカスタム ドメイン名が表示されます。
  6. カスタム ドメイン名を、作成したばかりの OSS ストレージ スペースにバインドします。

7. アクセスのテスト

  1. ブラウザのアドレス バーにカスタム ドメイン名を入力し (または CDN を使用してドメイン名にアクセスし)、アクセスできる場合は Enter キーを押します。 UniApp アプリケーション プログラムの設定は成功しました。
  2. アクセスに問題がある場合は、構成が間違っているかどうかを確認するか、CDN ドメイン名が有効になるまで待つことができます。

8. 概要

この記事では、UniApp アプリケーションを Alibaba Cloud OSS にデプロイし、カスタム ドメイン名を介してオンライン アクセスを実現する方法を紹介します。このようにして、アプリケーションを迅速にオンラインにし、より優れたアクセス エクスペリエンスを実現できます。

以上がuniappをossにデプロイする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート