Azure DevOps のAuthorizationが原因でArtifactsのinstallができなかった際の解決方法

## Prologue
Azure DevOps から`git clone`し、packageをインストールする為コマンドを実行したらエラーが出ました。その際の解決方法をメモとして残しておきます。

## 環境
- macOS: 10.15.2
- node.js: 10.16.0
- terminal: iTerm

- Project概要
    - 言語: Vue.js
    - パッケージマネージャ: `yarn`を使用していますが、エラー内容がわかりにくかった為、エラー内容の切り分けのため今回は所々で`npm`も使用しています。

## 解決方法

### `git clone`から Authorizationのエラーだと気付くまで
1. Azure DevOpsから`git clone`
2. package.jsonに記載されている内容でpackageをインストール

  ```
  yarn

  An unexpected error occurred: 
  "https://pkgs.dev.azure.com/***/_packaging/******/npm/registry/***/*** : Request 
  failed \"401 Unauthorized\"".
  ```

3\. `git clone`した際に認証の確認はしていたため、yarn.lockが問題かと思い削除し、再度`yarn`を実行。

```
yarn
error Couldn't find package "*******" on the "npm" registry.
```

このpackageはAzure DevOps¥Artifactsからインストールするのに、なぜnpm registryを見に行っているのか...
不明のため、試しに`npm install`で直接package名を指定してコマンドを実行。

```
npm install *******
npm ERR! code E401
npm ERR! Unable to authenticate, need: Bearer authorization_uri=https://login.windows.net/x***, Basic realm="https://pkgsprodea1.pkgs.visualstudio.com/", TFS-Federated
```

4\. 問題となっているpackage"*******"をpackage.jsonから削除して`yarn`を実行。
→ 結果: エラーなく成功したため、Azure DevOpsの認証にのみフォーカスしてトラブルシューティングを進めます。

5\. 念のため、認証以外に問題がないか、localにproxyサーバーを作成。そこにpublishしてインストールできるか確認しました。こちらは問題なくインストールできました。


### .npmrcとPAT

1. `npm ERR! Unable to authenticate, need: Bearer authorization_uri=`で検索すると.npmrcの作成に関して記述があったため、Azure DevOps に戻ります。

2. Azure DevOps¥Artifacts¥packages¥Connect to feed¥npm¥Project setup から.npmrcのDocumentを確認。
    Document: [Set up your client's npmrc](https://docs.microsoft.com/ja-jp/azure/devops/artifacts/npm/npmrc?view=azure-devops&tabs=mac)

3. 今回.npmrcは元々作成してあったため、PATの設定のみ対応。

### PATの設定

1. Azure DevOps¥Artifacts¥packages¥Connect to feed¥npm¥Project setupに`First time using Azure Artifacts with npm on this machine?`と書いてあるのでクリックすると[Set up your client's npmrc](https://docs.microsoft.com/ja-jp/azure/devops/artifacts/npm/npmrc?view=azure-devops&tabs=windows)に誘導されます。


2. `Create a token that lasts longer than 90 days:`の項目を確認。
  ※tokenの期限は状況によって異なるため、公式を確認しながら対応すること。
    
3. Azure DevOps　PATの設定画面に戻り設定をします。　
   Documentに沿ってsetup  
  Document: [Personl Access Token](https://docs.microsoft.com/ja-jp/azure/devops/organizations/accounts/use-personal-access-tokens-to-authenticate?view=azure-devops&tabs=preview-page)
    
4. New Token -> 
    setup内容
    // 詳細はDocument内にも記載があるので、最低限のsetupはそちらを参照すること 
    // 今回は以下の項目を設定   
    - Expiration:custome-deifined, Scopes: custome-defined, packaging: read & write
    
5. PAT が作成されます。passwordは何回か使うので、コピーして避けておくか別タブで開いておくようにしてください。
    
6. home directory直下でコマンドを実行。

```
echo -n "*****[PAT password]" | base64
```
    
7\. .npmrcにArtifacts¥packages¥Connect to feed¥npm¥Project setupのstep1の内容を貼り、適宜修正します。  

- 詳細は [Document](https://docs.microsoft.com/ja-jp/azure/devops/artifacts/npm/npmrc?view=azure-devops&tabs=mac)内『Create a token that lasts longer than 90 days:』項目3にも記載ありますが、比較しながら対応。
- PATはbase64にencodeしたものを貼付しました。

8\. PATをBase64に変換
6の結果と同じなので、省略してもOK。こちらもArtifacts¥packages¥Connect to feed¥npm¥Project setupとDocumentでコマンドが異なっていたため確認の目的で実行しました。
    
```
node -e "require('readline') .createInterface({input:process.stdin,output:process.stdout,historySize:0}) .question('PAT> ',p => { b64=Buffer.from(p.trim()).toString('base64');console.log(b64);process.exit(); })"
// PATを聞かれるため、ペーストしてEnter
PAT> *****[PAT code]
*****[PAT code encode Base64]==
```

9\. yarn -> success
    
10\. .npmrc の `//pkgs.dev.azure. ...`以下のコードはPAT等記載あるため削除
    -> 新たなpackageを追加しようとしたところ認証のエラー`npm ERR! Unable to authenticate...`がまた出たため、PATの記載ありに戻しました...

-> 解決しました。(2020/1/30 追記)

## homeディレクトリにPATのための .npmrcを設置

- $homeに .npmrcを設置

Documentに記載がありました。

参考: https://docs.microsoft.com/ja-jp/azure/devops/artifacts/npm/npmrc?view=azure-devops&tabs=mac

1. $homeの確認のために環境変数を確認します。

ターミナルで以下のコマンドを実行します。

```
printenv
```

一覧が表示されるので$home変数から自分のhomeディレクトリを確認します。


2\. .npmrcの設置
内容はプロジェクトに記載した.npmrcの` ; begin auth token`から`; end auth token`までを記載します。
移動終わったらプロジェクト内の` ; begin auth token`から`; end auth token`は削除してOK


## Epilogue

- .npmrcのPATに関する箇所は新しいパソコンとの認証が取れたため消して問題ないと思ったがエラーが出ました。
別途調査を続け、何かわかりしだい追記します。
-> 2020/1/30 追記: [homeディレクトリにPATのための .npmrcを設置](https://qiita.com/miiiii/items/5faf1162de478a469fae#home%E3%83%87%E3%82%A3%E3%83%AC%E3%82%AF%E3%83%88%E3%83%AA%E3%81%ABPAT%E3%81%AE%E3%81%9F%E3%82%81%E3%81%AE)

- また、通常は最初の`git clone`の時点でPAT確認が行われるはずだと思っていましたが、行われず...更に今回は別の認証と勘違いしていたため見落としていて解決まで時間がかかりました。
Azure DevOpsもArtifacts周りも慣れていないため、小さいことですが認証に関する知識がまた一つ増えてよかったと思います。

- トラブルシューティングも一つ一つこなしていけば、答え(があるものは)たどり着くことができるという自信にもつながりました。