Maison >interface Web >uni-app >Comment déployer Uniapp sur Oss

Comment déployer Uniapp sur Oss

PHPz
PHPzoriginal
2023-04-27 09:06:411379parcourir

UniApp est un framework de développement cross-end basé sur Vue.js et la technologie des mini-programmes. Les développeurs peuvent utiliser le même ensemble de code pour le développement sur différentes plates-formes, améliorant considérablement l'efficacité du développement. Une fois le développement terminé, nous devons déployer l'application sur le cloud pour un accès et une utilisation rapides.

Cet article expliquera comment déployer l'application UniApp sur Alibaba Cloud OSS (Object Storage Service) et obtenir un accès en ligne.

1. Introduction à OSS

Alibaba Cloud OSS est un service de stockage cloud hautement fiable et évolutif qui peut réaliser le stockage, la gestion et l'accès en ligne des données. OSS fournit des services de stockage de grande capacité, efficaces et peu coûteux, et prend également en charge divers types d'accès aux données.

2. Packaging UniApp

Avant de déployer l'application UniApp, nous devons la packager sous forme de fichier statique.

  1. Ouvrez le terminal et entrez dans le répertoire racine du projet UniApp.
  2. Exécutez la commande suivante pour empaqueter :
npm run build:h5
  1. Une fois l'empaquetage terminé, un dossier dist sera généré dans le répertoire du projet, qui contient les fichiers statiques de l'application. dist 文件夹,其中包含了应用程序的静态文件。

三、创建 OSS Bucket

  1. 登录阿里云控制台,选择 OSS。
  2. 点击「创建存储空间」。
  3. 在弹出的创建存储空间页面中,按需填写所需参数。选择存储空间类型为「标准存储」。其他选项可以采用默认设置。
  4. 点击「确定」完成创建。创建完成后,在存储空间列表中可以看到新建的存储空间。

四、上传文件到 OSS

  1. 点击存储空间名称,进入存储空间界面。
  2. 选择「文件管理」,在弹出的页面中选择「上传文件」。
  3. 在弹出的「上传文件」页面中,选择刚刚打包好的静态文件夹 dist 中的所有文件,然后点击「上传」按钮。
  4. 上传完成后,可以在文件管理列表中看到上传的文件。

五、配置 Bucket 域名

  1. 点击存储空间名称,进入存储空间界面。
  2. 选择「域名管理」,在页面中可以看到默认的 bucket-name.region.aliyuncs.com
  3. 3. Créez un compartiment OSS
  4. Connectez-vous à la console Alibaba Cloud et sélectionnez OSS.
  5. Cliquez sur "Créer un espace de stockage".
  6. Dans la page pop-up de création d'espace de stockage, renseignez les paramètres requis selon vos besoins. Sélectionnez le type d'espace de stockage comme « Stockage standard ». Les autres options peuvent être laissées à leurs paramètres par défaut.

Cliquez sur "OK" pour terminer la création. Après la création, vous pouvez voir l'espace de stockage nouvellement créé dans la liste des espaces de stockage.

  1. 4. Téléchargez des fichiers sur OSS
  2. Cliquez sur le nom de l'espace de stockage pour accéder à l'interface de l'espace de stockage.

Sélectionnez « Gestion des fichiers » et sélectionnez « Télécharger des fichiers » sur la page contextuelle.

Dans la page contextuelle « Télécharger des fichiers », sélectionnez tous les fichiers dans le dossier statique dist qui vient d'être emballé, puis cliquez sur le bouton « Télécharger ».

🎜Une fois le téléchargement terminé, vous pouvez voir les fichiers téléchargés dans la liste de gestion des fichiers. 🎜🎜🎜5. Configurer le nom de domaine du bucket 🎜🎜🎜Cliquez sur le nom de l'espace de stockage pour accéder à l'interface de l'espace de stockage. 🎜🎜Sélectionnez « Gestion des noms de domaine » et vous pourrez voir le nom de domaine d'accès par défaut au format bucket-name.region.aliyuncs.com sur la page. 🎜🎜Entrez dans la console CDN (si vous n'avez pas encore activé le service, vous devez d'abord l'activer) et sélectionnez « Gestion des noms de domaine » dans la console. 🎜🎜Cliquez sur « Ajouter un nom de domaine », puis suivez les instructions pour créer un nom de domaine personnalisé. 🎜🎜Une fois la création réussie, vous pouvez voir le nom de domaine personnalisé qui vient d'être ajouté dans la liste des noms de domaine. 🎜🎜Liez le nom de domaine personnalisé à l'espace de stockage OSS que vous venez de créer. 🎜🎜🎜7. Test d'accès🎜🎜🎜Entrez le nom de domaine personnalisé dans la barre d'adresse du navigateur (ou utilisez CDN pour accéder au nom de domaine), appuyez sur Entrée, si vous pouvez accéder à l'application UniApp, la configuration est réussie. 🎜🎜En cas de problème d'accès, vous pouvez vérifier si la configuration est incorrecte, ou attendre que le nom de domaine CDN prenne effet. 🎜🎜🎜8. Résumé🎜🎜Cet article explique comment déployer l'application UniApp sur Alibaba Cloud OSS et obtenir un accès en ligne via un nom de domaine personnalisé. De cette manière, les applications peuvent être mises en ligne rapidement et offrir une meilleure expérience d'accès. 🎜

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn