2017-04-12 7 views
0

URLを入力する入力タイプと、URLタイプを選択する選択タグがあります。 これで、選択したタイプと入力されたURLが一致するかどうかを確認したいのですが、instagram urlを入力してURLタイプをfacebookとして選択できないようにしてください。どのようにjavascriptでURLを検証するには?

だから私はこれを検証したいと思います。私は1つの関数を使用して検証しようとしましたが、URLを検証するためにはうまくいきましたが、写真URLまたはビデオURLの場合は、facebookとinstagramの検証もしたいと考えています。

現在、一般的にfacebook.comを検証しています。

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Post</title> 
</head> 
<body> 

<form class="postForm" id="postForm" method="post" action="addPost.php" enctype="multipart/form-data"> 

    <fieldset> 
     <legend>Please add the details below </legend> 
     <p> 

     <div id="link" style="display: none"> 

     <p> 
      <label for="url">URL (required)</label> 
      <input id="url" type="url" name="url" required> 
     </p> 

     <p> 
      <label for="urlType">Select Url Type :(required)</label> 
      <select name="urlType" id="urlType"> 
       <option value="">Select Url Type...</option> 
     <!--  <option value="0">Server Image</option> 
       <option value="1">Server Video</option>--> 
       <option value="2">YouTube Video</option> 
       <option value="3">Vimeo Video</option> 
       <option value="4">Facebook Image</option> 
       <option value="5">Facebook Video</option> 
       <option value="6">Instagram Image</option> 
       <option value="7">Instagram Video</option> 
       <option value="-1">Other</option> 
      </select> 
     </p> 

     </div> 

     <div id="filediv" style="display: none"> 

      Select file to upload: 
      <br><br> 
      <input name="file" type="file" id="fileToUpload"><br><br> 

     </div> 

     <p> 
      <input type="hidden" name="action_type" id="action_type_id"/> 
      <input type="hidden" name="id" id="p_id"/> 

      <input type="submit" name="submit" id="submit" value="Submit"> 
     </p> 
    </fieldset> 

    <div class="result" id="result"></div> 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
    <script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/jquery.validate.min.js"></script> 
    <script> 

     $('#postForm').validate({ // initialize the plugin 
      rules: { 
       title: { 
        required: true, 
        minlength : 2 
       }, 
       url: { 
        required: true 
       }, 
       desc: { 
        required : true, 
        minlength : 2 
       }, 
       keywords : { 
        required : true, 
        minlength : 2 
       }, 
       urlType : 
        { 
         required : true 
        }, 
       postType : 
        { 
         required : true 
        }, 
       category : 
        { 
         required : true 
        }, 
       file : 
        { 
         required : true 
        } 
      }, 
      submitHandler: function (form) { // for demo 

       var url = document.getElementById('urlType').value; 

       if(validate_url(document.getElementById('url').value) == 'facebook' && url != 4) 
       { 
        alert('Please enter valid facebook image url or select valid url type.'); 
       } 
       else if(validate_url(document.getElementById('url').value) == 'facebook' && url != 5) 
       { 
        alert('Please enter valid facebook video url or select valid url type.'); 
       } 
       else if(validate_url(document.getElementById('url').value) == 'instagram' && url != 6) 
       { 
        alert('Please enter valid instagram image url or select valid url type.'); 
       } 
       else if(validate_url(document.getElementById('url').value) == 'instagram' && url != 7) 
       { 
        alert('Please enter valid instagram video url or select valid url type.'); 
       } 
       else if(validate_url(document.getElementById('url').value) == 'vimeo' && url != 3) 
       { 
        alert('Please enter valid vimeo video url or select valid url type.'); 
       } 
       else if(validate_url(document.getElementById('url').value) == 'youtube' && url != 2) 
       { 
        alert('Please enter valid youtube video url or select valid url type.'); 
       } 
       else { 
        userAction('add'); 
       } 
      } 
     }); 


     function userAction(type,id){ 

      var statusArr = {add:"added",edit:"updated",delete:"deleted"}; 

      if (type == 'add') { 

       $('#action_type_id').val(type); 
       $('#p_id').val(id); 
      } 
      $.ajax({ 
       type: 'POST', 
       url: 'addPost.php', 
       data: $('#postForm').serialize(), 
       success:function(report){ 
        // replace data to report 
        $(".result").html(report); 

        $("#postForm").trigger('reset'); 
       } 
      }); 
     } 


     function validate_url(url) 
     { 
      if (/^(https?:\/\/)?((w{3}\.)?)facebook.com\/.*/i.test(url)) 
       return 'facebook'; 

      if (/^(https?:\/\/)?((w{3}\.)?)instagram.com\/.*/i.test(url)) 
       return 'instagram'; 

      if (/^(https?:\/\/)?((w{3}\.)?)vimeo.com\/.*/i.test(url)) 
       return 'vimeo'; 

      if (/^(https?:\/\/)?((w{3}\.)?)youtube.com\/.*/i.test(url)) 
       return 'youtube'; 

      return 'unknown'; 
     } 

    </script> 
</form> 
</body> 
</html> 

リンクがFacebookブックのイメージ、FacebookブックのビデオまたはInstagramのイメージ、Instagramのビデオの場合はどうすれば検証できますか?

お願いします..ありがとうございます。

+0

あなたが「リンクがFacebookの画像、Facebookのビデオのためのものであるかどうかを検証する」と言ったとき...それはFacebookによって主催されたビデオや画像ですか? FacebookにはたくさんのCDNがあるので、さまざまなURLパターンを検証しなければならず、それらが同じままであることを保証することはできません。すなわち、 'scontent.fsnc1-1.fna.fbcdn.net'は潜在的なドメインです – aug

+0

はい、Facebookのビデオや画像であることを確認したいと思っています@aug – Sid

答えて

0

私は先に行って、別のURLの形成の様々なを見て、ここにいくつかです:

Facebookのビデオ

https://video.fsnc1-1.fna.fbcdn.net/v/*.mp4

Facebookのイメージ

https://scontent.fsnc1-1.fna.fbcdn.net/v/*.jpg

Instagramのビデオ

正規表現については

https://instagram.fsnc1-1.fna.fbcdn.net/*.mp4

Instagramのイメージ

https://instagram.fsnc1-1.fna.fbcdn.net/*.jpg

あなたは彼らが一般的にフェイスブックが主催したかどうかを確認したい場合は、ドメインがfbcdn.netた場合は、検証可能性があります。 Instagramの場合は、すべてのアセットがサブドメインに接頭辞として表示されているようです。fsnc1-1.fnaは、CDNが最も近いサーバーを要求している場所に関連している可能性があります。たとえば、ブラジルからWebページテストを実行すると、scontent-gru2-2.xx.fbcdn.netのアセットが表示されるので、その正規表現を動的にする必要があります。

これが役に立ちます。

+0

https://www.facebook.com/OccupyDemocrats/videos/1497544510338598/ビデオのURLがこのような場合は?このようなfacebookイメージはhttps://www.facebook.com/facebook/photos/a.376995711728.190761.20531316728/10154878491331729/?type=3&theater – Sid

関連する問題