使用 Instagram 的嵌入 url 时 Webview 无法显示
Posted
技术标签:
【中文标题】使用 Instagram 的嵌入 url 时 Webview 无法显示【英文标题】：Webview failed to display when using embed url of Instagram 【发布时间】：2019-06-15 16:37:29 【问题描述】：这是一个奇怪的问题。当我使用如下网址时：https://www.instagram.com/p/Bs421mHgPM4/ 此代码正在显示 Webview。但是当我像这样https://www.instagram.com/p/Bs421mHgPM4/embed/更改为嵌入模式时 我的 Webview 不显示任何内容。我的代码如下：
public class WebReadingActivity extends AppCompatActivity
private Unbinder unbinder;
@BindView(R.id.toolbar)
Toolbar toolbar;
@BindView(R.id.progress_frame)
FrameLayout progressbarFrame;
@BindView(R.id.progress_bar_line)
ProgressBar progressBar;
@BindView(R.id.webview_news)
WebView webViewNews;
@Override
protected void onCreate(Bundle savedInstanceState)
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_web_reading);
unbinder = ButterKnife.bind(this);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(true);
//String urlData = getIntent().getStringExtra(EXTRA_URL_NEWS);
String urlData = "https://www.instagram.com/p/Bs421mHgPM4/embed";
configureProgressbarLine();
loadNewsByWeb(urlData);
private void loadNewsByWeb(String url)
webViewNews.setWebViewClient(new WebReadingClient());
webViewNews.getSettings().setjavascriptEnabled(true);
webViewNews.getSettings().setAppCacheEnabled(true);
webViewNews.getSettings().setDomStorageEnabled(true);
webViewNews.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
webViewNews.getSettings().setSupportMultipleWindows(true);
webViewNews.getSettings().setSupportZoom(false);
webViewNews.getSettings().setBuiltInZoomControls(false);
CookieManager.getInstance().setAcceptCookie(true);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP)
webViewNews.getSettings().setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
CookieManager.getInstance().setAcceptThirdPartyCookies(webViewNews, true);
webViewNews.loadUrl(url);
public static class WebReadingClient extends WebViewClient
@Override
public void onPageFinished(WebView view, String url)
super.onPageFinished(view, url);
@Override
public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error)
super.onReceivedError(view, request, error);
@Override
public void onReceivedError(WebView view, int errorCode, String description, String failingUrl)
super.onReceivedError(view, errorCode, description, failingUrl);
和布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_
android:layout_
tools:context=".WebReadingActivity">
<include
android:id="@+id/app_bar_layout"
layout="@layout/appbar_layout" />
<ScrollView
android:layout_below="@+id/progress_frame"
android:layout_
android:layout_>
<LinearLayout
android:layout_
android:layout_
android:orientation="vertical">
<WebView
android:id="@+id/webview_news"
android:layout_
android:layout_/>
</LinearLayout>
</ScrollView>
</RelativeLayout>请给我一些建议
【问题讨论】：
【参考方案1】：使用我用你的网址测试过的这段代码，它工作正常，这段代码已经在 webview 中上传图片
public class classname extends AppCompatActivity
private static final int INPUT_FILE_REQUEST_CODE = 1;
private static final String TAG = MainActivity.class.getSimpleName();
// Storage Permissions variables
private static final int REQUEST_EXTERNAL_STORAGE = 1;
private static String[] PERMISSIONS_STORAGE =
android.Manifest.permission.READ_EXTERNAL_STORAGE,
android.Manifest.permission.WRITE_EXTERNAL_STORAGE,
android.Manifest.permission.CAMERA
;
private WebView webView;
private WebSettings webSettings;
private ValueCallback<Uri[]> mUploadMessage;
private String mCameraPhotoPath = null;
private long size = 0;
public static void verifyStoragePermissions(Activity activity)
// Check if we have read or write permission
int writePermission = ContextCompat.checkSelfPermission(activity,
android.Manifest.permission.WRITE_EXTERNAL_STORAGE);
int readPermission = ContextCompat.checkSelfPermission(activity,
android.Manifest.permission.READ_EXTERNAL_STORAGE);
int cameraPermission = ContextCompat.checkSelfPermission(activity,
android.Manifest.permission.CAMERA);
if (writePermission != PackageManager.PERMISSION_GRANTED || readPermission !=
PackageManager.PERMISSION_GRANTED || cameraPermission !=
PackageManager.PERMISSION_GRANTED)
// We don't have permission so prompt the user
ActivityCompat.requestPermissions(
activity,
PERMISSIONS_STORAGE,
REQUEST_EXTERNAL_STORAGE
);
@Override
public void onActivityResult(int requestCode, int resultCode, Intent data)
if (requestCode != INPUT_FILE_REQUEST_CODE || mUploadMessage == null)
super.onActivityResult(requestCode, resultCode, data);
return;
try
String file_path = mCameraPhotoPath.replace("file:", "");
File file = new File(file_path);
size = file.length();
catch (Exception e)
Log.e("Error!", "Error while opening image file" + e.getLocalizedMessage());
if (data != null || mCameraPhotoPath != null)
Integer count = 0; //fix fby https://github.com/nnian
ClipData images = null;
try
images = data.getClipData();
catch (Exception e)
Log.e("Error!", e.getLocalizedMessage());
if (images == null && data != null && data.getDataString() != null)
count = data.getDataString().length();
else if (images != null)
count = images.getItemCount();
Uri[] results = new Uri[count];
// Check that the response is a good one
if (resultCode == Activity.RESULT_OK)
if (size != 0)
// If there is not data, then we may have taken a photo
if (mCameraPhotoPath != null)
results = new Uri[]Uri.parse(mCameraPhotoPath);
else if (data.getClipData() == null)
results = new Uri[]Uri.parse(data.getDataString());
else
for (int i = 0; i < images.getItemCount(); i++)
results[i] = images.getItemAt(i).getUri();
mUploadMessage.onReceiveValue(results);
mUploadMessage = null;
@Override
protected void onCreate(Bundle savedInstanceState)
super.onCreate(savedInstanceState);
setContentView(R.layout.my_web);
verifyStoragePermissions(this);
webView = (WebView) findViewById(R.id.webview);
webSettings = webView.getSettings();
webSettings.setAppCacheEnabled(true);
webSettings.setCacheMode(webSettings.LOAD_CACHE_ELSE_NETWORK);
webSettings.setJavaScriptEnabled(true);
webSettings.setLoadWithOverviewMode(true);
webSettings.setAllowFileAccess(true);
webView.setWebViewClient(new PQClient());
webView.setWebChromeClient(new PQChromeClient());
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(true);
//if SDK version is greater of 19 then activate hardware acceleration otherwise
activate software acceleration
if (Build.VERSION.SDK_INT >= 19)
webView.setLayerType(View.LAYER_TYPE_HARDWARE, null);
else if (Build.VERSION.SDK_INT >= 11 && Build.VERSION.SDK_INT < 19)
webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
webView.loadUrl("https://www.instagram.com/p/Bs421mHgPM4/embed/");
webView.setWebViewClient(new WebViewClient()
public void onPageFinished(WebView view, String url)
ProgressBar progressbar = (ProgressBar) findViewById(R.id.progress_bar);
progressbar.setVisibility(View.GONE);
);
;
private File createImageFile() throws IOException
// Create an image file name
String timeStamp = new SimpleDateFormat("yyyyMMdd_HHmmss").format(new Date());
String imageFileName = "JPEG_" + timeStamp + "_";
File storageDir = Environment.getExternalStoragePublicDirectory(
Environment.DIRECTORY_PICTURES);
File imageFile = File.createTempFile(
imageFileName, /* prefix */
".jpg", /* suffix */
storageDir /* directory */
);
return imageFile;
public boolean onKeyDown(int keyCode, KeyEvent event)
// Check if the key event was the Back button and if there's history
if ((keyCode == KeyEvent.KEYCODE_BACK) && webView.canGoBack())
webView.goBack();
return true;
// If it wasn't the Back key or there's no web page history, bubble up to the
default
// system behavior (probably exit the activity)
return super.onKeyDown(keyCode, event);
public class PQChromeClient extends WebChromeClient
// For Android 5.0+
public boolean onShowFileChooser(WebView view, ValueCallback<Uri[]> filePath,
WebChromeClient.FileChooserParams fileChooserParams)
// Double check that we don't have any existing callbacks
if (mUploadMessage != null)
mUploadMessage.onReceiveValue(null);
mUploadMessage = filePath;
Log.e("FileCooserParams => ", filePath.toString());
Intent takePictureIntent = new Intent(MediaStore.ACTION_IMAGE_CAPTURE);
if (takePictureIntent.resolveActivity(getPackageManager()) != null)
// Create the File where the photo should go
File photoFile = null;
try
photoFile = createImageFile();
takePictureIntent.putExtra("PhotoPath", mCameraPhotoPath);
catch (IOException ex)
// Error occurred while creating the File
Log.e(TAG, "Unable to create Image File", ex);
// Continue only if the File was successfully created
if (photoFile != null)
mCameraPhotoPath = "file:" + photoFile.getAbsolutePath();
takePictureIntent.putExtra(MediaStore.EXTRA_OUTPUT,
Uri.fromFile(photoFile));
else
takePictureIntent = null;
Intent contentSelectionIntent = new Intent(Intent.ACTION_GET_CONTENT);
contentSelectionIntent.addCategory(Intent.CATEGORY_OPENABLE);
contentSelectionIntent.putExtra(Intent.EXTRA_ALLOW_MULTIPLE, true);
contentSelectionIntent.setType("image/*");
Intent[] intentArray;
if (takePictureIntent != null)
intentArray = new Intent[]takePictureIntent;
else
intentArray = new Intent[2];
Intent chooserIntent = new Intent(Intent.ACTION_CHOOSER);
chooserIntent.putExtra(Intent.EXTRA_INTENT, contentSelectionIntent);
chooserIntent.putExtra(Intent.EXTRA_TITLE, "Select Chooser");
chooserIntent.putExtra(Intent.EXTRA_INITIAL_INTENTS, intentArray);
startActivityForResult(Intent.createChooser(chooserIntent, "Select Files"),
1);
return true;
public class PQClient extends WebViewClient
ProgressDialog progressDialog;
public boolean shouldOverrideUrlLoading(WebView view, String url)
// If url contains mailto link then open Mail Intent
if (url.contains("mailto:"))
// Could be cleverer and use a regex
//Open links in new browser
view.getContext().startActivity(
new Intent(Intent.ACTION_VIEW, Uri.parse(url)));
// Here we can open new activity
return true;
else
// Stay within this webview and load url
view.loadUrl(url);
return true;
//Show loader on url load
public void onPageStarted(WebView view, String url, Bitmap favicon)
// Then show progress Dialog
// in standard case YourActivity.this
if (progressDialog == null)
progressDialog = new ProgressDialog(classname.this);
progressDialog.setMessage("Loading...");
progressDialog.hide();
// Called when all page resources loaded
public void onPageFinished(WebView view, String url)
webView.loadUrl("javascript:(function() " +
"document.getElementById('android-app').style.display='none';)()");
try
// Close progressDialog
if (progressDialog.isShowing())
progressDialog.dismiss();
progressDialog = null;
catch (Exception exception)
exception.printStackTrace();
【讨论】：
我必须使用PQChromeClient中找到的方法吗？ PQChromeClient 用于从 webview 浏览图像。如果您需要从 webview 浏览图像，您可以尝试在您的情况下，您可以使用 PQClient 方法加载 url 更好的是你可以使用这个完整的代码，它会正常工作 好让我试试 这个答案有帮助吗@NandaZ以上是关于使用 Instagram 的嵌入 url 时 Webview 无法显示的主要内容，如果未能解决你的问题，请参考以下文章